import { useTranslation } from 'react-i18next';
import { useAppSelector } from 'app/store/storeHooks';

import ParametersModal from '../ParametersModal';
import ArtisticEffectAvatarGroup from './ArtisticEffectAvatarGroup';
import ArtisticEffectPickerContent from './ArtisticEffectPickerContent';
export default function ArtisticEffect() {
  const { t } = useTranslation();
  const { userPaintingMenuConfig } = useAppSelector((store) => store.preset);
  if (userPaintingMenuConfig.indexOf('parameters.artisticEffect') < 0) {
    return null;
  }
  return (
    <ParametersModal
      title={t('parameters.artisticEffect')}
      triggerRight={<ArtisticEffectAvatarGroup />}
    >
      <ArtisticEffectPickerContent />
    </ParametersModal>
  );
}
